@import './variables.scss';
@import './mixin.scss';
@import './transition.scss';
@import './element-ui.scss';
@import './sidebar.scss';
@import "element-ui-variables";

body {
  height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
}

label {
  font-weight: 700;
}

html {
  height: 100%;
  box-sizing: border-box;
}

#app {
  height: 100%;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

a:focus,
a:active {
  outline: none;
}

a,
a:focus,
a:hover {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}

div:focus {
  outline: none;
}

.clearfix {
  &:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
  }
}

// main-container global css
.app-container {

}

//搜索框
.filter-container {
  .filter-block {
    min-width: 300px;display: inline-block;height: 56px;line-height: 56px;
    span{
        min-width: 80px;text-align: right;font-size: 14px;color: $--color-text-regular;display: inline-block;
    }
    .el-date-editor {
      span {
        min-width: 0;
      }
    }
    >div{
      width: 177px;
    }
  }
  .filter-btn-area{
    min-width: 300px;display: inline-block;height: 56px;line-height: 56px;
    >button{
      margin: 0 10px
    }
  }

  .ope-btn-area{
    position: relative;right: -8px;text-align: right;
    line-height: 60px;
    &::after{
      content: '';
      display: block;
      clear: both;
    }

    >button{
      margin: 0 8px;
    }
  }
}


//自定义清除按钮样式
.el-button--none{
  color: $--color-primary;
  border: 1px solid $--color-primary;
}

.table-ope-btn-around{
  display: flex;justify-content: space-around;
}

.align-left{
  text-align:left;
}
.link{
  color: $--color-primary;
  cursor: pointer;
}

.ele-form-label {
  font-weight: 700;
  width: 120px;
  text-align: right;
  float: left;
  //display: inline-block;
  vertical-align: top;
  font-size: 14px;
  color: $--color-text-regular;
  line-height: 40px;
  padding: 0 12px 0 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.ele-form-content{
  line-height: 40px;
  position: relative;
  font-size: 14px;
  float: left;
  width: calc(100% - 140px);
  color: $--color-text-regular;
}


.edit-title-line{
  background: #f2f2f2;height: 38px;line-height: 38px;border-radius: 3px;text-indent: 1em;font-size: 15px;margin: 18px 0;
}

.el-form-item{
  margin-bottom: 24px;
}

.edit-body{
  padding: 27px 0;
  .el-form-item{
    margin-bottom: 24px;
  }
}

.normal-form-item{
  width: 440px;display: inline-block;
}

.width-125{
  width: 125px !important;
}
.width-300{
  width: 300px !important;
}
.width-250{
  width: 250px !important;
}
.width-400{
  width: 400px;
}

.ele-form-item{
  display: inline-block;width: 440px;margin-bottom: 24px;
  &::after{
    content: "";
    display: block;
    clear: both;
  }
}
.ele-form-line{
  margin-bottom: 24px;
  &::after{
    content: "";
    display: block;
    clear: both;
  }
}

.photo-preview{
  width: 150px;height: 200px;display: block;background: #f2f2f2;border-radius: 6px;
}

.import-tip{
  padding: 0 50px;line-height: 32px;
}
.import-tip-success{
  @extend .import-tip;
  color: $--color-primary;
}

.import-tip-fail{
  @extend .import-tip;
  color: $--color-danger;
}

.ele-form-tip{
  font-size: 14px;
  color: $--color-text-secondary;
}

.ellipsis{
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}

.course-add {
.course-add-file {
 .el-upload-list{
   display: none;
 }
}
  //.el-upload-list {
  //  display: none;
  //}

  .el-upload-list__item {
    width: 20%;
    background-color: #ffffff;
  }
  .el-upload-list__item .el-icon-close {
    display: block;
  }
  &-file {
    .el-icon-close:before {
      content: "删除" !important;
      color: #f00;
    }
  }
  .el-checkbox-group {
    margin-left: 100px;
  }
}
.course {
  .normal-form-item{
    width: 640px !important;display: inline-block;
  }
  .el-form-item__error {
    left: 100px !important;
  }
  .el-form-item__label {
    text-align: left;
  }
  .btn-none {
    color: $--color-primary;
    border: 1px solid $--color-primary;
    background: #ffffff;
  }
  .ele-form-item {
    margin-bottom: 6px;
  }
  .ele-form-label {
    width: unset;
    float: left;
  }

  .annex-list-item {
    height: 40px;
    display: flex;
    justify-content: left;
    align-items: center;
    &-index{
      width: 20px;
      height: 20px;
      background: $--color-primary;
      line-height: 20px;
      text-align: center;
      border-radius: 10px;
      color: #ffffff;
    }
    &-annexName{
      margin: 0 20px;
      font-size: 14px;
      color: $--color-text-secondary;
    }
    &-download {
      color:  $--color-primary;
      font-size: 14px;
      cursor: pointer;
    }
    &-delete {
      color:   $--color-danger;
      font-size: 14px;
      cursor: pointer;
    }
  }

  .ellipsis2 {
    @include multiline-ellipsis();
  }

}
.ellipsis2{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;

}
.course-detail {
  .postscript {
    display: flex;
    padding: 0 1em;
    justify-content: space-between;
    text-indent: unset !important;
    &-edit {
      cursor: pointer;
      color: $--color-primary;
    }
  }
  .no-content {
    text-align: center;
  }
  //查看备课信息评论相关
  .course-detail-comment {
    border: 1px solid $--color-text-secondary;
    position: relative;
    &-item {
      margin: 20px;
      border-bottom: 1px dashed $--color-text-secondary;
      display: flex;
      flex-direction: column;
      &-desc{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        &-left-time {
          margin-left: 10px;
          color: $--color-text-secondary;
        }
        &-buttons-edit {
          cursor: pointer;
          color: $--color-primary;
        }
        &-buttons-delete {
          cursor: pointer;
          color: $--color-danger;
        }
      }
      &-commentDetail {
        margin: 20px 0;
      }
    }
    .un-bottom-line {
      flex-direction: row-reverse !important;
      border-bottom: unset !important;
    }
    &-pagination {
      position: absolute;
      bottom: 0px;
      right: 20px;
    }
  }

  .publish-comment {
    border: 1px solid $--color-text-secondary;
    margin-top: 20px;
    padding: 20px;
    .el-textarea {
      .el-textarea__inner {
       //resize: none;
      }
    }
    &-btn {
      margin-top: 10px;
       display: flex;
      flex-direction: row-reverse;
    }
  }
}
//后记相关
.postscript{
  //.el-form-item__error {
  //  top: 25% !important;
  //  right: 20px !important;
  //  left: unset !important;
  //}
  .ele-form-item {
    width: auto !important;
    margin-right: 40px;
  }
  .ele-form-content {
    width: auto !important;
    color: $--color-text-secondary;
  }
  &-content {
    .form-warn {
      margin-left: 20px;
      color: $--color-danger;
    }
  }
  .el-form-item__error {
    left: 60px !important;
  }
  &-add-content {
    .form-warn {
      margin-left: 20px;
      color:  $--color-danger;
    }
  }
}
//反馈相关
.feedback {
  .edit-title-line-unset-margin-top {
    margin-top: unset !important;
  }
  //.el-form-item__error {
  //  top: 25% !important;
  //  right: 20px !important;
  //  left: unset !important;
  //}
  .ele-form-item {
    width: auto !important;
    margin-right: 40px;
  }
  .ele-form-content {
    width: auto !important;
    color: $--color-text-secondary;
  }
  &-content {
    .form-warn {
      margin-left: 20px;
      color: $--color-danger;;
    }
  }

  &-list {
    &-item {
      padding-bottom: 20px;
      //border-bottom:  1px  dashed $--color-text-secondary ;
      margin-bottom: 20px;
      &-msg {
        height: 50px;
        line-height: 50px;
        display: flex;
        justify-content: space-between;
        justify-items: center;
      }
      &-operating {
        cursor: pointer;
        font-size: 14px;
        width: 100px;
        &-edit {
          color: $--color-primary;
        }
        &-delete {
          margin-left: 10px;
          color:  $--color-danger;
        }
      }
    }
  }
  &-footer{
    //margin-top: 20px;
  }

  .association-lesson{
    width: 100%;
    display: flex;
    margin-bottom: 20px;
    &-label {
      font-weight: 700;
      color: #666666;
      width: 82px;
      line-height: 40px;
      font-size: 14px;
    }
    &-content {
      font-size: 12px;
      color: #999999;
      width: calc(100% - 82px);
      line-height: 40px;
    }
  }
}
.ele-form-content {
  font-size: 12px !important;
}

.width-500 {
  width: 500px !important;
}
.width-label {
  .el-form-item__label {
    width: 100px !important;
    text-align: left;
  }
  //.el-form-item__error {
  //  right: -100px !important;
  //}
}
.feedback-special-form-item {
  display: flex;
  align-items: center;
  .el-form-item {
    margin-bottom: unset;
  }
  margin-bottom: 22px;
}
.schoolFeedBack {
  .el-checkbox__label {
    color:  $--color-primary;
  }
  .el-checkbox__input.is-disabled+span.el-checkbox__label {
    color:  $--color-primary;
  }
  .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
    border-color: $--color-primary;
  }
  .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
    border-color: $--color-primary;

  }
}



